<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <title>领用单管理</title>
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
  <link rel="stylesheet" href="../css/base.css">
  <link rel="stylesheet" href="../../css/element-ui.css" />
  <link rel="stylesheet" href="../css/index.css">
   <!--[if lt IE 9]>
    <link rel="stylesheet" href="../css/pages/ie8.css"/>
    <script src="../../js/common/html5shiv.min.js"></script>
    <script src="../../js/common/respond.min.js"></script>
    <script src="../../js/common/es5-shim.min.js"></script>
    <![endif]-->
  	<script src="../../js/common/jquery.min.js"></script>
  	<script src="../../js/common/browser.min.js"></script>
    <script src="../../js/common/vue.js"></script>
    <script src="../../js/common/element-ui.js"></script>
    <script src="../js/common/common.js"></script>
</head>
<body>
<div id="wtly" class="container" v-cloak>
  <div class="rj-header">
    <p class="nav">
      <span class="default">您现在所在的位置:</span>
      <span class="direction">{{prams.breadcrumb}}</span>
    </p>
    <div class="search-container">
      <div class="item">
        <label>录入时间</label>
        <div class="time-wrapper">
	        <el-date-picker
				v-model="inputTimeStart"
				type="datetime"
				format="yyyy-MM-dd HH:mm:ss"
				placeholder="选择起始时间">
			</el-date-picker>
        </div>
        <span>---</span>
        <div class="time-wrapper">
	        <el-date-picker
				v-model="inputTimeEnd"
				type="datetime"
				format="yyyy-MM-dd HH:mm:ss"
				placeholder="选择结束时间">
			</el-date-picker>
        </div>
      </div>
      <div class="item">
        <label>领用人</label>
         <select v-model="selectedLYUser" :disabled ="isBan">
	         <option  value ="all">全部</option>
	         <option v-for="v in LYUsers" :value ="v.InputUserID">{{v.InputUserName}}</option>
        </select>
      </div>
      <div class="item">
        <label>领用房间</label>
       <select v-model="selectedRoom" :disabled ="isBan">
         <option  value ="all">全部</option>
         <option v-for="v in inRooms" :value ="v.RoomID">{{v.RoomName}}</option>
        </select>
      </div>
      <div class="item">
        <label>单据状态</label>
        <select v-model="StatusStr">
          <option value="all">全部</option>
          <option value="lr">已录入</option>
          <option value="fs">已发送</option>
          <option value="sh">已审核</option>
          <option value="ly">已完成</option>
          <option value="zf">已作废</option>
        </select>
      </div>
      <div class="item">
      	<el-button size="small" type="primary" @click="search">查询</el-button>
      	<el-button size="small" type="primary" v-if="!isUserJS" @click="jumpToNewBill()">新建单据</el-button>
      	<el-button size="small" type="info" @click="back">返回</el-button>
      </div>
    </div>
  </div>
   
  <div class="table-wrapper"> 
   
  <el-table
    :data="BillData"
    border
    style="width: 1300px"
    height="400">
    <el-table-column 
      prop="BillSN"
      label="单据流水号"
      align="center"
      width="180">
    </el-table-column>   
    <el-table-column
      prop="InputTime"
      label="申请时间"
      align="center"
      show-overflow-tooltip
      width="200">
    </el-table-column>
    <el-table-column
      prop="DrawTime"
      label="完成日期"
      align="center"
      show-overflow-tooltip
      width="200">
    </el-table-column>
    <el-table-column
      prop="StatusName"
      label="单据状态"
       align="center"
      width="120">
    </el-table-column>
    <el-table-column 
      prop="InputUserName"
      label="录入人"
       align="center"
      width="120">
    </el-table-column>
    <el-table-column
      prop="DrawUserName"
      label="领用人"
       align="center"
      width="120">
    </el-table-column>
    <el-table-column
      prop="InRoomName"
      label="领用房间"
       align="center"
      width="180">
    </el-table-column>
     <el-table-column
      fixed="right"
       align="center"
      label="操作"
      width="200">
      <template scope="scope"> 
     	<el-button type="text" @click="handleClick(scope.row)" size="small">查看</el-button>
     	
     	<el-button type="text" size="small" v-if="!isUserJS" @click="handleClick(scope.row)" :disabled="!scope.row.operationRights.isEditor">修改</el-button>
     	<el-button type="text" size="small" v-if="!isUserJS" @click="sendClick(scope.row)"  :disabled="!scope.row.operationRights.isSend">发送</el-button>
     	<el-button type="text" size="small" v-if="!isUserJS" @click="handleDel(scope.row)" :disabled="!scope.row.operationRights.isZf">作废</el-button>
      </template>
    </el-table-column>
  </el-table>
  </div>	
</div>
<script>
var app = new Vue({
	  el: '#wtly',
	  data: {
		  prams:JSON.parse(GetRequest().param), 
		  userJS:JSON.parse(localStorage.getItem("userJS")),
		  isUserJS:localStorage.getItem("userJS")&&JSON.parse(localStorage.getItem("userJS")).length>0?true:false,
		  inputTimeStart:getDay(-3)+" 00:00:00",
		  inputTimeEnd:getDay(0)+" 23:59:59",
		  userID:JSON.parse(localStorage.getItem("currentUser")).Ygid,
		  tableData:['单据流水号','申请时间','完成日期','单据状态','录入人','领用人','领用房间'],
		  BillData:[],
		  inRooms:[],
		  LYUsers:[],
		  selectedRoom:"all",
		  selectedLYUser:"all",
		  StatusStr:'all',
		  isBan:false,
		  active:0
	  },
	 created:function(){
		 var that=this;
		 this.GetLYUsers();
		 this.getInRoom().then(function(){
				that.getBills();
			})
	 },
	  
	 methods:{
		 toName: function (value) {
			    if (!value) return ''
			    value = value.toString()
			    switch(value)
				{
					case "lr": value ="已录入"
				 	 break;
					case "fs": value ="已发送"
					  	break;
					case "sh": value ="已审核"
					  	break;
					case "ly": value ="已完成"
					  	break;
					case "dz": value ="登账"
					  	break;
					case "jz": value ="结账"
					  	break;
					case "zf": value ="已作废"
					  	break;
				}
			    return value
			  },
		operationRights: function (value) {
			if (!value) return ''
				value = value.toString()
			var operations={}
				switch(value)
				{
					case "lr": 
						operations={
							isEditor:true,
							isSend:true,
							isZf:true
						}
						break;
					
					case "fs": 
						operations={
							isEditor:true,
							isSend:false,
							isZf:true
						}
						break;
					case "sh":
						operations={
							isEditor:false,
							isSend:false,
							isZf:false
						}
						break;
					case "zf": 
						operations={
							isEditor:false,
							isSend:false,
							isZf:false
						}
				   	 	break;
					}
				return operations
		},	  
		 handleClick:function(o){
			 window.location.href="newBill.html?param="+encodeURI(JSON.stringify(this.prams))+'&BillSN='+o.BillSN; 
		 },
		 sendClick:function(o){
			 var that = this;
			 var parms ={
						className: 'TwoLevelStockManager',
				        method: 'SendDrawBill',
				        billSN:o.BillSN,
				        userID: this.userID
					  } 
			 this._fetch(parms).then(function(data){
				 	that.getBills();
			 		that.$message({
				          message: '发送成功',
				          type: 'success'
				        });
				 })
		 },
		 handleDel:function(o){
			 var that = this
			 var parms ={
					className: 'TwoLevelStockManager',
			        method: 'NullifyDrawBill',
			        billSN:o.BillSN,
			        userID: this.userID
				  } 
		 	this._fetch(parms).then(function(data){
		 		that.getBills();
		 		that.$message({
			          message: '作废成功',
			          type: 'success'
			        });
			 })
			  
		 },
		search:function(){
			 this.getBills()
		},
		back:function(){
			parent.showMenuFn()
			parent.$('#main').empty()
		}, 
		jumpToNewBill:function(){
			window.location.href="newBill.html?param="+encodeURI(JSON.stringify(this.prams)); 
		},
		conditionModel:function(ColumnName, FullString, Oper, Value, Type) {

		      var obj = {
		          "ColumnName": ColumnName,
		          "FullString": FullString,
		          "Oper": Oper,
		          "Value": Value,
		          "Type": Type
		      }
		      return obj;
		  },
		  conditionsModel:function(Conditions, Type) {
		      var obj = {
		          "Conditions": Conditions,
		          "Type": Type
		      }
		      return obj
		  },
		getBills:function(){
			var that = this
			var arr =[];
			var condition;
			var inputTimeStart = typeof this.inputTimeStart == "object"?this.inputTimeStart.format("yyyy-MM-dd hh:mm:ss"):this.inputTimeStart;
			var inputTimeEnd = typeof this.inputTimeEnd == "object"?this.inputTimeEnd.format("yyyy-MM-dd hh:mm:ss"):this.inputTimeEnd
			if(!inputTimeStart||!inputTimeEnd){
				that.$message.error('时间必选！');
				return false
			}
			var InputUserID = this.selectedLYUser 
			var Status =  this.StatusStr
			var RoomID = this.selectedRoom
			
			 var StartTime = this.conditionModel("mb.InputTime", null, "MoreOrEqual", inputTimeStart, "DateTime")
		      var EndTime =  this.conditionModel("mb.InputTime", null, "Less", inputTimeEnd, "DateTime")
		      var oInputUserID = this.conditionModel("mb.InputUserID", null, "Equal", InputUserID, "String")
		      var oStatusStr =  this.conditionModel("mb.Status", null, "Equal", Status, "String")
		      var oRoomID = this.conditionModel("mb.InRoomID", null, "Equal", RoomID, "String")
		  	 
		      var isAlls=[InputUserID,Status,RoomID];
		     var conditions = [oInputUserID,oStatusStr,oRoomID];
		     arr = [StartTime, EndTime];
		     for(var i=0;i<conditions.length;i++){
		    	 if(isAlls[i] !== 'all'){
	    	        	arr = arr.concat([conditions[i]])
	    	        }
		     }
		     condition =  this.conditionsModel(arr, "AND")
			 var parms ={
						className: 'TwoLevelStockManager',
				        method: 'GetBills',
				        condition:JSON.stringify(condition)
					  } 
				 this._fetch(parms).then(function(data){
					 var data = data
					 if(data.length>0){
						 data = data.map(function(item){
							 //item.StatusStr = that.toName(item.StatusStr)
							 that.$set(item,"StatusName",that.toName(item.StatusStr))
							 that.$set(item,"operationRights",that.operationRights(item.StatusStr))
							 return item 
						 }) 
					 }
					 that.BillData = data
				 })
		},
		GetLYUsers:function(){
			var that = this
			 var DeptAccountID =JSON.parse(localStorage.getItem("deptInfo")).DeptAccountID
			var parms ={
					className: 'TwoLevelStockManager',
			        method: 'GetUsersWithDept',
			        deptAccountID: DeptAccountID
				  } 
				return this._fetch(parms).then(function(data){
					 if(data.length == 0){
						 that.$message.error('暂无领用人可选！');
						 return false
					 }
					 that.LYUsers = data
				 })
		},
		 getInRoom: function(){
			 var that = this
			 //var DeptAccountID = this.prams.InDeptAccount.DeptAccountID
			 var DeptAccountID =JSON.parse(localStorage.getItem("deptInfo")).DeptAccountID
			 var Dep = this.conditionModel("a.DeptAccountID", null, "Equal", DeptAccountID, "String")
			 var Status = this.conditionModel("a.Status", null, "Equal", 1, "Int32")
			 var yxbz  = this.conditionModel("a.yxbz ", null, "Equal", 1, "Int32")
			 var arr = [Dep, Status, yxbz] 	
		      var  condition = this.conditionsModel(arr, "AND")
			 var parms ={
						className: 'TwoLevelStockManager',
				        method: 'GetRoomsToDepts',
				        condition:JSON.stringify(condition),
				        userID: this.userID
					  } 
			return this._fetch(parms).then(function(data){
				 if(data.length == 0){
					 that.$message.error('暂无房间可选！');
					 return false
				 }
				 that.inRooms = data
				 //that.selectedRoom = data[0]
				// that.$set(that.Head,"RoomInfo",that.selectedRoom)
			 })
			 
		 },
		 _fetch:function(parms){
			 return new Promise(function(resolve, reject) {
			 $.ajax({
				  type: 'POST',
				  url: getRootPath()+'/api/sendPostRequest' ,
				  headers: {
					  'Accept': 'application/json',
				      'Content-Type': 'application/json'
			        },
				  data: JSON.stringify(parms),
				  success: function(res){
					  if(res.isSessionInvalidated){
						  parent.window.location.href = getRootPath()+'login.html'
					  }
					  if(res.issuccess==0){
						 var result = res.result.match(/^[ ]*$/)?res.result:JSON.parse(res.result);
						 resolve(result)
					  }else {
						  reject(res.Message);
					  }
				},
				error:function(err){
					new Error(err)
				}
			 });
			 });
		 }
		
		
	 }
	})
</script>
</body>
</html>